﻿
@{
    //ViewBag.Title = "ServiceDo";
    //Layout = "~/Views/Shared/_Layout.cshtml";
    Layout = null; // 如果不需要布局文件，可以设置为null
}

<script type="text/html" id="toolbarTable">
    <div class="layui-btn-container" style="width: auto; white-space: normal;">
        @{
            // 生成动态日期按钮（今天+未来4天共5天）
            var startDate = DateTime.Today;
            for (int i = 0; i < 7; i++)
            {
                var currentDate = startDate.AddDays(i);
                var dateString = currentDate.ToString("yyyy-M-d");
                var dayOfWeek = currentDate.DayOfWeek;
                var chineseWeekday = "";

                // 转换为中文星期
                switch (dayOfWeek)
                {
                    case DayOfWeek.Sunday: chineseWeekday = "周日"; break;
                    case DayOfWeek.Monday: chineseWeekday = "周一"; break;
                    case DayOfWeek.Tuesday: chineseWeekday = "周二"; break;
                    case DayOfWeek.Wednesday: chineseWeekday = "周三"; break;
                    case DayOfWeek.Thursday: chineseWeekday = "周四"; break;
                    case DayOfWeek.Friday: chineseWeekday = "周五"; break;
                    case DayOfWeek.Saturday: chineseWeekday = "周六"; break;
                }

                <button class="layui-btn layui-btn-xs" style="white-space: normal; height: auto; line-height: 1.5; padding: 0 5px;" lay-event="filterDate" data-date="@dateString">
                    @dateString<br>@chineseWeekday
                </button>
            }
        }
    </div>
</script>

<script type="text/html" id="toolbarCol">
    {{#  if(d.IsDelete === 1){ }}
    <button class="layui-btn layui-btn-xs layui-btn-disabled" disabled>已完成</button>
    {{#  } else { }}
    <button class="layui-btn layui-btn-xs" lay-event="confirm">服务确认</button>
    {{#  } }}
</script>



<body>

    <div style="padding: 16px;">
        <div class="layui-card">
            <div class="layui-card-body">
                <div class="layui-row">

                    <div class="layui-col-lg1 layui-col-lg1" style="padding: 10px; background-color: #f8f8f8; border-radius: 4px;">
                        <div id="test13" class="demo-tree-more"></div>
                        <div style="margin: 8px 0;">
                            <div class="layui-btn-container" style="text-align: center;">
                                <!-- 任务数量统计区域 -->
                                <div style="margin-bottom: 15px; padding: 10px; background: #f2f2f2; border-radius: 4px;">
                                    <div style="font-weight: bold; margin-bottom: 5px; color: #333;">任务数量</div> <div id="totalCount">0</div>
                                    <div style="display: flex; justify-content: space-around;">
                                        <div>
                                            <div style="font-size: 12px; color: #666;">已完成</div>
                                            <div id="completedCount">0</div>
                                        </div>
                                        <div>
                                            <div style="font-size: 12px; color: #666;">未完成</div>
                                            <div id="pendingCount">0</div>
                                        </div>

                                    </div>
                                </div>

                                <button class="layui-btn layui-btn-sm layui-btn-primary" style="width: 100%; margin-bottom: 8px; " lay-event="all"> 全部 </button>
                                <button class="layui-btn layui-btn-sm " style="width: 100%; margin-bottom: 8px;" lay-event="confirm">儿童</button>
                                <button class="layui-btn layui-btn-sm " style="width: 100%; margin-bottom: 8px;" lay-event="confirm">护理 </button>
                                <button class="layui-btn layui-btn-sm " style="width: 100%; " lay-event="confirm">美容</button>
                            </div>
                        </div>
                    </div>

                    <div class="layui-col-md10 layui-col-lg10">
                        <table class="layui-hide" id="testTask" lay-filter="testTask"></table>

                        <script>
                            layui.use(['table', 'util', 'layer', 'jquery', 'laydate'], function () {
                                var table = layui.table;
                                var util = layui.util;
                                var layer = layui.layer;
                                var $ = layui.jquery;
                                var laydate = layui.laydate;

                                // 当前选中的过滤条件
                                var currentFilter = {
                                    serviceType: null,
                                    date: getCurrentDateString(), // 默认设置为当前日期
                                    isAll: false, // 表示是否点击了"全部"按钮
                                    activeFilter: 'date' // 记录当前激活的筛选类型
                                };

                                // 获取当前日期字符串 (yyyy-MM-dd)
                                function getCurrentDateString() {
                                    var now = new Date();
                                    return now.getFullYear() + '-' +
                                        String(now.getMonth() + 1).padStart(2, '0') + '-' +
                                        String(now.getDate()).padStart(2, '0');
                                }

                                // 初始化表格
                                // 修改表格初始化代码
                                function initTable() {
                                    table.render({
                                        elem: '#testTask',
                                        url: '/ServiceTask/DataList',
                                        where: getFilterParams(),
                                        toolbar: '#toolbarTable',
                                        defaultToolbar: [],
                                        height: 'full-200',
                                        cellMinWidth: 90,
                                        page: true,
                                        limits: [10, 20, 30, 40],
                                        limit: 10,
                                        cols: [[
                                            { type: 'checkbox', fixed: 'left' },
                                            { field: 'ServiceName', title: '服务名称' },
                                            { field: 'RoomName', title: '房间名称' },
                                            { field: 'ParturientName', title: '产妇名' },
                                            {
                                                field: 'BabyNames',
                                                title: '宝宝名',
                                                templet: function (d) {
                                                    return d.BabyNames || '';
                                                }
                                            },
                                            {
                                                field: 'ServiceTime',
                                                title: '系统分配时间',
                                                templet: function (d) {
                                                    // 直接显示已格式化的日期字符串
                                                    return d.ServiceTime || '';
                                                }
                                            },
                                            {
                                                field: 'IsDelete',
                                                title: '完成状态',
                                                templet: function (d) {
                                                    return d.IsDelete === 1 ? '<span class="layui-badge layui-bg-green">已完成</span>' : '<span class="layui-badge">未完成</span>';
                                                }
                                            },
                                            {
                                                title: '操作',
                                                fixed: 'right',
                                                toolbar: '#toolbarCol',
                                                width: 150
                                            }
                                        ]],
                                        parseData: function (res) {
                                            // 确保响应数据格式正确
                                            updateTaskCount(res);   // 直接使用后端返回的统计对象
                                            checkDuplicateServices(res.data);
                                            highlightCurrentButton();
                                            return {
                                                "code": res.code || 0,
                                                "msg": res.msg || "",
                                                "count": res.count || 0,
                                                "data": res.data || []
                                            };

                                        },
                                        //done: function (res, curr, count) {

                                        //    updateTaskCount(res);   // 直接使用后端返回的统计对象
                                        //    checkDuplicateServices(res.data);
                                        //    highlightCurrentButton();
                                        //}
                                    });
                                }

                                // 高亮显示当前选中按钮
                                function highlightCurrentButton() {
                                    // 重置所有按钮状态
                                    $('.layui-btn-container button').removeClass('layui-btn-active');

                                    if (currentFilter.isAll) {
                                        $('button[lay-event="all"]').addClass('layui-btn-active');
                                    } else if (currentFilter.date) {
                                        $('[lay-event="filterDate"][data-date="' + currentFilter.date + '"]').addClass('layui-btn-normal layui-btn-active'); //蓝色样式
                                    } else if (currentFilter.serviceType) {
                                        // 高亮对应的服务类型按钮
                                        var btnText = '';
                                        switch (currentFilter.serviceType) {
                                            case 1: btnText = '儿童'; break;
                                            case 2: btnText = '护理'; break;
                                            case 3: btnText = '美容'; break;
                                        }
                                        $('button[lay-event="confirm"]').filter(function () {
                                            return $(this).text().trim() === btnText;
                                        }).addClass('layui-btn-normal  layui-btn-active');
                                    }
                                }
                                // 更新任务数量统计
                                function updateTaskCount(res) {
                                    var data = res.data
                                    if (!data) return;

                                    // 计算总任务数量
                                    var total = res.count;  // 获取任务数据的总数量

                                    // 计算已完成的任务数量
                                    var completed = data.filter(function (item) {
                                        return item.IsDelete === 1; // 已完成的任务 IsDelete = 1
                                    }).length;

                                    // 计算未完成的任务数量
                                    var pending = total - completed;  // 未完成的任务数量

                                    // 更新页面上显示的数字
                                    $('#totalCount').text(total);  // 更新总任务数量
                                    $('#completedCount').text(completed);  // 更新已完成任务数量
                                    $('#pendingCount').text(pending);  // 更新未完成任务数量
                                }


                                // 检查重复服务并显示修改按钮
                                // 检查重复服务并显示修改按钮
                                function checkDuplicateServices(data) {
                                    // 清除旧的调整按钮
                                    $('.adjust-btn').remove();

                                    // 只有在有数据、不是全部模式且不是服务类型筛选时才显示调整按钮
                                    if (!data || data.length === 0 || currentFilter.isAll || currentFilter.activeFilter === 'service') return;

                                    var serviceMap = {};

                                    // 找出重复的服务
                                    data.forEach(function (item) {
                                        if (!serviceMap[item.ServiceName]) {
                                            serviceMap[item.ServiceName] = [];
                                        }
                                        serviceMap[item.ServiceName].push(item);
                                    });

                                    // 为重复服务添加修改按钮(只有当重复数量达到阈值时才显示)
                                    for (var serviceName in serviceMap) {
                                        var services = serviceMap[serviceName];
                                        // 获取第一个服务的阈值(假设相同服务的阈值相同)
                                        var threshold = services[0].ServiceThreshold || 0;

                                        // 只有当重复数量达到或超过阈值时才显示调整按钮
                                        if (services.length >= threshold && threshold > 0) {
                                            $('td[data-field="ServiceName"]').each(function () {
                                                if ($(this).text().trim() === serviceName.trim()) {
                                                    $(this).append('<button class="layui-btn layui-btn-xs layui-btn-warm adjust-btn" style="margin-left:5px;">调整时间</button>');
                                                }
                                            });
                                        }
                                    }

                                    // 绑定调整时间按钮事件
                                    $('.adjust-btn').off('click').on('click', function () {
                                        var serviceName = $(this).parent().text().replace('调整时间', '').trim();
                                        showAdjustTimeDialog(serviceName, serviceMap[serviceName]);
                                    });
                                }


                                // 显示调整时间对话框
                                function showAdjustTimeDialog(serviceName, services) {
                                    var content = '<div style="padding:20px;">' +
                                        '<p>服务名称: ' + serviceName + '</p>' +
                                        '<div style="margin:15px 0;">请选择要调整的服务:</div>';

                                    services.forEach(function (service, index) {
                                        content += '<div style="margin-bottom:10px;">' +
                                            '<input type="radio" name="serviceItem" value="' + service.Id + '" id="service' + index + '"' +
                                            (index === 0 ? ' checked' : '') + '>' +
                                            '<label for="service' + index + '" style="margin-left:5px;">' +
                                            '房间: ' + service.RoomName + ', 时间: ' +
                                            (service.ServiceTime.match(/\/Date\((\d+)\)\//) ?
                                                util.toDateString(parseInt(service.ServiceTime.match(/\/Date\((\d+)\)\//)[1]), 'yyyy-MM-dd HH:mm:ss') :
                                                service.ServiceTime) +
                                            '</label></div>';
                                    });

                                    content += '<div class="layui-form-item" style="margin-top:15px;">' +
                                        '<label class="layui-form-label">新时间</label>' +
                                        '<div class="layui-input-block">' +
                                        '<input type="text" class="layui-input" id="newServiceTime" placeholder="yyyy-MM-dd HH:mm:ss">' +
                                        '</div></div></div>';

                                    var dialogIndex = layer.open({
                                        type: 1,
                                        title: '调整服务时间',
                                        area: ['500px', '400px'],
                                        content: content,
                                        btn: ['确定', '取消'],
                                        success: function (layero, index) {
                                            // 初始化日期时间选择器
                                            laydate.render({
                                                elem: '#newServiceTime',
                                                type: 'datetime',
                                                format: 'yyyy-MM-dd HH:mm:ss',
                                                value: new Date(),
                                                ready: function () {
                                                    this.hint('请选择新的服务时间');
                                                }
                                            });
                                        },
                                        yes: function (index) {
                                            var selectedId = $('input[name="serviceItem"]:checked').val();
                                            var newTime = $('#newServiceTime').val();

                                            if (!selectedId) {
                                                layer.msg('请选择要调整的服务', { icon: 2 });
                                                return;
                                            }

                                            if (!newTime) {
                                                layer.msg('请输入新的时间', { icon: 2 });
                                                return;
                                            }

                                            adjustServiceTime(selectedId, newTime, index);
                                        }
                                    });
                                }

                                // 调整服务时间
                                function adjustServiceTime(id, newTime, layerIndex) {
                                    layer.load(2); // 显示加载中

                                    $.post('/ServiceTask/AdjustServiceTime', {
                                        id: id,
                                        newTime: newTime
                                    }, function (res) {
                                        layer.closeAll('loading');
                                        if (res.success) {
                                            layer.msg('调整成功', { icon: 1 });
                                            layer.close(layerIndex);
                                            // 保持当前过滤条件重新加载数据
                                            reloadTable();
                                        } else {
                                            layer.msg(res.message || '调整失败', { icon: 2 });
                                        }
                                    }).fail(function () {
                                        layer.closeAll('loading');
                                        layer.msg('请求失败，请检查网络', { icon: 2 });
                                    });
                                }

                                // 获取当前过滤参数
                                function getFilterParams() {
                                    var params = {};

                                    // 根据当前激活的筛选类型设置参数
                                    switch (currentFilter.activeFilter) {
                                        case 'service':
                                            params.serviceType = currentFilter.serviceType;
                                            break;
                                        case 'date':
                                            params.filterDate = currentFilter.date;
                                            break;
                                        case 'all':
                                            // 全部模式不传特定参数
                                            break;
                                    }

                                    // 添加防缓存参数
                                    params._ = new Date().getTime();
                                    return params;
                                }




                                // 在reloadTable函数中添加done回调
                                function reloadTable() {
                                    table.reload('testTask', {
                                        where: getFilterParams(),
                                        page: { curr: 1 },
                                        done: function (res, curr, count) {
                                            // 更新任务数量统计
                                            updateTaskCount(res.data);

                                            // 检查重复服务
                                            checkDuplicateServices(res.data);

                                            // 高亮当前按钮
                                            highlightCurrentButton();

                                            // 重新绑定事件
                                            $('.layui-btn-container').off('click', 'button[lay-event="filterDate"]').on('click', 'button[lay-event="filterDate"]', function () {
                                                currentFilter.date = $(this).data('date');
                                                currentFilter.serviceType = null;
                                                currentFilter.isAll = false;
                                                currentFilter.activeFilter = 'date';
                                                reloadTable();
                                            });
                                        }
                                    });
                                }
                                // 更新按钮状态
                                function updateButtonStates() {
                                    // 重置所有按钮状态
                                    $('.layui-btn-container button').removeClass('layui-btn-active');

                                    // 根据当前筛选类型高亮对应按钮
                                    switch (currentFilter.activeFilter) {
                                        case 'service':
                                            var btnText = '';
                                            switch (currentFilter.serviceType) {
                                                case 1: btnText = '儿童'; break;
                                                case 2: btnText = '护理'; break;
                                                case 3: btnText = '美容'; break;
                                            }
                                            $('button[lay-event="confirm"]').filter(function () {
                                                return $(this).text().trim() === btnText;
                                            }).addClass('layui-btn-active');
                                            break;

                                        case 'date':
                                            $('[lay-event="filterDate"][data-date="' + currentFilter.date + '"]')
                                                .addClass('layui-btn-active');
                                            break;

                                        case 'all':
                                            $('[lay-event="all"]').addClass('layui-btn-active');
                                            break;
                                    }
                                }

                                // 初始化事件监听
                                function initEvents() {
                                    // 服务类型按钮 - 使用事件委托
                                    $('.layui-btn-container').on('click', 'button[lay-event="confirm"]', function () {
                                        // 1. 移除所有服务按钮的active状态（保持日期按钮状态不变）
                                        $('button[lay-event="confirm"]').removeClass('layui-btn-normal layui-btn-active');

                                        // 2. 给当前点击的服务按钮添加蓝色active状态
                                        $(this).addClass('layui-btn-normal layui-btn-active');

                                        // 3. 设置筛选条件（保持原有功能）
                                        currentFilter.serviceType = getServiceTypeByText($(this).text());
                                        currentFilter.date = null;
                                        currentFilter.isAll = false;
                                        currentFilter.activeFilter = 'service';
                                        reloadTable();
                                    });

                                    // 全部按钮
                                    $('.layui-btn-container').on('click', 'button[lay-event="all"]', function () {
                                        // 1. 移除所有按钮的active状态（包括服务和日期）
                                        $('.layui-btn-container button').removeClass('layui-btn-normal layui-btn-active');

                                        // 2. 给"全部"按钮添加active状态（默认灰色）
                                        $(this).addClass('layui-btn-active');

                                        // 3. 设置筛选条件
                                        currentFilter.serviceType = null;
                                        currentFilter.date = null;
                                        currentFilter.isAll = true;
                                        currentFilter.activeFilter = 'all';
                                        reloadTable();
                                    });

                                    // 日期按钮
                                    $('.layui-btn-container').on('click', 'button[lay-event="filterDate"]', function () {
                                        // 1. 移除所有日期按钮的active状态（保持服务按钮状态不变）
                                        $('button[lay-event="filterDate"]').removeClass('layui-btn-normal layui-btn-active');

                                        // 2. 给当前点击的日期按钮变蓝
                                        $(this).addClass('layui-btn-normal layui-btn-active');

                                        // 3. 设置筛选条件
                                        currentFilter.date = $(this).data('date');
                                        currentFilter.serviceType = null;
                                        currentFilter.isAll = false;
                                        currentFilter.activeFilter = 'date';
                                        reloadTable();
                                    });
                                    // 行工具事件
                                    table.on('tool(testTask)', function (obj) {
                                        var data = obj.data; // 获得当前行数据
                                        var layEvent = obj.event; // 获得lay-event对应的值
                                        debugger
                                        if (layEvent === 'confirm') {
                                            // 弹出confirm页面
                                            layer.confirm('确定要确认完成此服务吗', function (index) {
                                                layer.load(2);
                                                $.post('/ServiceTask/ConfirmService', { id: data.Id }, function (res) {
                                                    layer.closeAll('loading');
                                                    layer.msg(res.success ? '操作成功' : (res.message || '操作失败'), {
                                                        icon: res.success ? 1 : 2
                                                    });
                                                    if (res.success == 1) {

                                                    }
                                                    if (res.success) {
                                                        reloadTable();
                                                    }
                                                }).fail(function () {
                                                    layer.closeAll('loading');
                                                    layer.msg('请求失败，请检查网络', { icon: 2 });
                                                });
                                                layer.close(index);
                                            });
                                        }
                                    });
                                }
                                // 辅助函数：根据按钮文本获取服务类型
                                function getServiceTypeByText(text) {
                                    var map = { '儿童': 1, '护理': 2, '美容': 3 };
                                    return map[text.trim()];
                                }

                                // 确认服务
                                function confirmService(id) {
                                    layer.confirm('确定要确认完成此服务吗', function (index) {
                                        layer.load(2);
                                        $.post('/ServiceTask/ConfirmService', { id: id }, function (res) {
                                            layer.closeAll('loading');
                                            layer.msg(res.success ? '操作成功' : (res.message || '操作失败'), {
                                                icon: res.success ? 1 : 2
                                            });
                                            if (res.success == 1) {

                                            }
                                            if (res.success) {
                                                reloadTable();
                                            }
                                        }).fail(function () {
                                            layer.closeAll('loading');
                                            layer.msg('请求失败，请检查网络', { icon: 2 });
                                        });
                                        layer.close(index);
                                    });
                                }

                                // 初始化
                                $(function () {
                                    initTable();
                                    initEvents();
                                });
                            });
                        </script>
                    </div>

                </div>
            </div>

        </div>
    </div>

    <script type="text/html" id="toolbarDemoTask">
        <div class="layui-btn-container">
            <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
            <button class="layui-btn layui-btn-sm" lay-event="getData">获取当前页数据</button>
            <button class="layui-btn layui-btn-sm" id="dropdownButton">
                下拉按钮
                <i class="layui-icon layui-icon-down layui-font-12"></i>
            </button>
            <button class="layui-btn layui-btn-sm" id="reloadTest">
                重载测试
                <i class="layui-icon layui-icon-down layui-font-12"></i>
            </button>
            <button class="layui-btn layui-btn-sm layui-btn-primary" id="rowMode">
                <span>{{= d.lineStyle ? '多行' : '单行' }}模式</span>
                <i class="layui-icon layui-icon-down layui-font-12"></i>
            </button>
        </div>
    </script>
    <script type="text/html" id="barDemoTask">
        <div class="layui-clear-space">
            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-xs" lay-event="more">
                更多
                <i class="layui-icon layui-icon-down"></i>
            </a>
        </div>
    </script>
</body>

